import {
  ModalForm,
  ProFormInstance,
  Submitter,
} from '@ant-design/pro-components';
import {
  ProForm,
  ProFormCascader,
  ProFormDateRangePicker,
  ProFormDigit,
  ProFormMoney,
  ProFormSelect,
  ProFormText,
  ProFormTreeSelect,
  ProFormDatePicker,
  ProFormTextArea,
  ProDescriptions,
  ProFormDependency,
} from '@ant-design/pro-components';
const { Item } = ProDescriptions;
import ProLayout, {
  PageContainer,
  SettingDrawer,
  FooterToolbar,
} from '@ant-design/pro-layout';
import { history, useRequest } from 'umi';
import {
  EllipsisOutlined,
  PlusOutlined,
  InboxOutlined,
} from '@ant-design/icons';
import {
  DownOutlined,
  UpOutlined,
  FileSearchOutlined,
} from '@ant-design/icons';
import {
  message,
  TreeSelect,
  Button,
  Card,
  Breadcrumb,
  Space,
  Dropdown,
  Menu,
  Collapse,
  Modal,
  Divider,
} from 'antd';
import React, { useEffect, useRef, useState } from 'react';
import type { ProColumns } from '@ant-design/pro-components';
import {
  EditableProTable,
  ProCard,
  ProFormField,
  ProFormRadio,
  ProTable,
} from '@ant-design/pro-components';
import { methods } from '@/utils/request';
import { UploadProps, Upload } from 'antd';
import { UploadOutlined } from '@ant-design/icons';
import TbaleExplainMap from '@/components/TipsMap';
import moment from 'moment';
import { TitleAdapter } from '../../commons/Adapter';
const { Panel } = Collapse;
const { Dragger } = Upload;

export default () => {
  const addPersonFrom = useRef<ProFormInstance>();
  // const [dataSource, setDataSource] = useState<any>([]);
  const [gutter, setGutter] = useState(12);
  const [pageType, setPageType] = useState(
    history.location.pathname.replace(
      '/LabAchievements/ScientificResearch/VerticalProject/EditVerticalProject/',
      '',
    ),
  );
  const [filedDisable, setFiledDisable] = useState({
    userid: true,
    userJobLevel: true,
    userJobTitle: true,
    userType: true,
  });

  const [userListTabelFlag, setUserListTabelFlag] = useState<any>(false); //人员列表弹窗显示与否
  const [userListTabelData, setUserListTabelData] = useState<any>([]); //人员列表表格数据

  const [newpath, setNewPath] = useState();

  const [selectedUserListTabelData, setSelectedUserListTabelData] =
    useState<any>([]); //选中的人员列表数据，用于提交
  const [selectedRowKeys, setSelectedRowKeys] = useState<any>([]); //默认全选
  const [formDataForSubmit, setFormDataForSubmit] = useState<any>(); //表单数据，用于提交
  const [yearFundDataTemp, setYearFoundDataTemp] = useState<any>([]); //年度金额表格缓存数据
  const [yearFundData, setYearFoundData] = useState<any>([]); //年度金额表格数据，用于提交
  const [yearVisible, setYearVisible] = useState(false); //

  const [saveType, setSaveType] = useState(''); //modal 点击确认 调用新增、更新还是暂存接口
  const [allLabel, setAllLabel] = useState([]);
  const [formData, setFormData] = useState<any>();
  const formRef = useRef<ProFormInstance>();
  const editYearFormRef = useRef<ProFormInstance>();
  const props: UploadProps = {
    name: 'file',
    action: 'http://10.1.40.84:9993/common/uploadFile',
    headers: {
      Authorization: localStorage.getItem('token') || '',
    },
    maxCount: 1,
    onChange(info) {
      if (info.file.status !== 'uploading') {
        console.log(info.file, info.fileList);
      }
      if (info.file.status === 'done') {
        console.log(info?.file?.response?.code == 401);
        console.log(info);

        if (info?.file?.response?.code == 200) {
          formRef.current?.setFieldsValue({
            annexPath: info?.file?.response.data,
          });
          message.success(`${info.file.name} 上传成功！`);
        } else if (info?.file?.response?.code == 401) {
          message.error('用户登录过期请重新登陆！');
        } else {
          message.error(`${info.file.name} 上传失败`);
        }
      } else if (info.file.status === 'error') {
        message.error(`${info.file.name} 上传失败！`);
      }
    },
  };
  //获取全部项目标签，用于下拉框
  const getAllLabel = useRequest(
    (data = null) => {
      return {
        url: 'http://10.1.40.84:9993/getAllLabel',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
      };
    },
    {
      onSuccess: (result, param) => {
        setAllLabel(result);
      },
    },
  );

  //添加标签
  const addLabelDetail = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/addLabelDetail',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
        getAllLabel.run();
        message.success('添加成功');
      },
      onError: (e, params) => {
        console.log(e);
        console.log(params);
      },
      // formatResult: res => res
      manual: true,
    },
  );
  //更改年度小表
  const updateYearFund = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/updateYearFund`,
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
        if (result.code === 200) {
          message.success(result.msg);
          getOneVertProjDetail.run(pageType); //重新拉取信息
          setYearVisible(false); //关闭弹窗
        } else {
          message.error(result.msg);
        }
      },
      manual: true,
      formatResult: (res) => res,
    },
  );

  //获取纵向项目详细信息
  const getOneVertProjDetail = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/getOneVertProjDetail?id=${data}`,
        method: 'GET',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
      };
    },
    {
      onSuccess: (result, params) => {
        var temp = JSON.parse(JSON.stringify(result.yearList));
        temp.map((e: any) => {
          e.tableKey =
            e.year + '' + (e.yearFund + '') + Math.trunc(Math.random() * 100);
        });
        temp.sort((a: any, b: any) => {
          return parseInt(b.year || '0') - parseInt(a.year || '0');
        });
        setFormData(result);
        formRef.current?.setFieldsValue(result);
        setYearFoundDataTemp(temp);
        setYearFoundData(temp);
      },
      manual: true,
    },
  );

  //修改纵向项目
  const updateVertProj = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/updateVertProj`,
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data: data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
        if (result.code === 200) {
          history.push('/LabAchievements/ScientificResearch/VerticalProject');
          message.success(result.msg);
        } else {
          message.error(result.msg);
        }
      },
      manual: true,
      formatResult: (res) => res,
    },
  );

  //新建纵向项目
  const insertNewVertProj = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/insertNewVertProj`,
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
        if (result.code === 200) {
          history.push('/LabAchievements/ScientificResearch/VerticalProject');
        } else {
          message.error(result.msg);
        }
      },
      manual: true,
      formatResult: (res) => res,
    },
  );

  //暂存纵向项目
  const insertTempVertProj = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/insertTempVertProj`,
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        message.info(result.msg);
        history.push('/LabAchievements/ScientificResearch/VerticalProject');
      },
      manual: true,
      formatResult: (res) => res,
    },
  );

  //审核
  const updateStatusIpi = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/common/updateStatus',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
    },
  );

  //根据人员字符串返回人员详情
  const getUserList = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/user/getUserList',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        if (result) {
          setUserListTabelData(result);
          setSelectedUserListTabelData(result);
          setUserListTabelFlag(true);
          var temp: any = [];
          result.map((e: any) => {
            temp.push(e.webId);
          });
          setSelectedRowKeys(temp);
        }
      },
      manual: true,
    },
  );

  //人员列表表头
  const columns: any = [
    {
      title: '工号',
      key: 'username',
      dataIndex: 'username',
    },
    {
      title: '姓名',
      key: 'realName',
      dataIndex: 'realName',
    },
    {
      title: '类别',
      key: 'userType',
      dataIndex: 'userType',
    },
  ];

  //表单年度金额表头
  const columnsYearFoundForm: any = [
    {
      title: '年度',
      key: 'year',
      dataIndex: 'year',
      align: 'center',
    },
    {
      title: '到校款金额(万元)',
      key: 'yearFund',
      dataIndex: 'yearFund',
      align: 'center',
    },
    {
      title: '操作',
      key: 'edit',
      align: 'center',
      // hideInTable: localStorage.getItem('isEdit') === '查看',
      width: 150,
      render: (_: any, record: any) => {
        return (
          <Space>
            <ModalForm
              title={'编辑年度到校金额'}
              formRef={editYearFormRef}
              trigger={<Button type="link">编辑</Button>}
              onFinish={async (values) => {
                var temp = yearFundData.filter((e: any) => {
                  return e.tableKey != record.tableKey;
                });
                temp.push({
                  ...values,
                  tableKey:
                    values.year +
                    '' +
                    (values.yearFund + '') +
                    Math.trunc(Math.random() * 100),
                });
                temp.sort((a: any, b: any) => {
                  return parseInt(b.year || '0') - parseInt(a.year || '0');
                });
                setYearFoundData(temp);
                return true;
              }}
              request={() => {
                return record;
              }}
              modalProps={{
                destroyOnClose: true,
              }}
              grid
              width={'20%'}
            >
              <ProFormDatePicker.Year
                name={'year'}
                label={'年度'}
                rules={[{ required: true, message: '请输入年度' }]}
                disabled
              />
              <ProFormDigit
                name={'yearFund'}
                label={'到校款金额(万元)'}
                rules={[{ required: true, message: '请输入到校款金额' }]}
              />
            </ModalForm>
            {/* <Button
              type="link"
              onClick={() => {
                var temp = yearFundData.filter((e: any) => {
                  return e.tableKey != record.tableKey;
                });
                setYearFoundData(temp);
              }}
            >
              删除
            </Button> */}
          </Space>
        );
      },
    },
  ];

  //列表年度金额表头
  const columnsYearFoundList: any = [
    {
      title: '年度',
      key: 'year',
      dataIndex: 'year',
    },
    {
      title: '到校款金额(万元)',
      key: 'yearFund',
      dataIndex: 'yearFund',
    },
    {
      title: '操作',
      key: 'edit',
      align: 'center',
      // hideInTable: localStorage.getItem('isEdit') === '查看',
      width: 150,
      render: (_: any, record: any) => {
        return (
          <Space>
            <ModalForm
              title={'编辑年度到校金额'}
              formRef={editYearFormRef}
              trigger={<Button type="link">编辑</Button>}
              onFinish={async (values) => {
                var temp = yearFundData.filter((e: any) => {
                  return e.tableKey != record.tableKey;
                });
                temp.push({
                  ...values,
                  tableKey:
                    values.year +
                    '' +
                    (values.yearFund + '') +
                    Math.trunc(Math.random() * 100),
                });
                temp.sort((a: any, b: any) => {
                  return parseInt(b.year || '0') - parseInt(a.year || '0');
                });
                setYearFoundData(temp);
                return true;
              }}
              request={() => {
                return record;
              }}
              modalProps={{
                destroyOnClose: true,
              }}
              grid
              width={'20%'}
            >
              <ProFormDatePicker.Year
                name={'year'}
                label={'年度'}
                rules={[{ required: true, message: '请输入年度' }]}
                disabled
              />
              <ProFormDigit
                name={'yearFund'}
                label={'到校款金额(万元)'}
                rules={[{ required: true, message: '请输入到校款金额' }]}
              />
            </ModalForm>
            {/* <Button
              type="link"
              onClick={() => {
                var temp = yearFundData.filter((e: any) => {
                  return e.tableKey != record.tableKey;
                });
                setYearFoundData(temp);
              }}
            >
              删除
            </Button> */}
          </Space>
        );
      },
    },
  ];

  //新建项目提交
  const insertSubmit = () => {
    var userListTemp: any = [];
    selectedUserListTabelData.map((e: any) => {
      var temp = {
        userid: e.username,
        username: e.realName,
        userrank: e.userrank,
        usertype: e.usertype,
        userindentify: e.userindentify,
        userjobtitle: e.technicalName,
        userjoblevel: e.technicalGrade,
      };
      userListTemp.push(temp);
    });
    insertNewVertProj.run({
      ...formDataForSubmit,
      timeList: [
        moment(formDataForSubmit.timeList[0]).format('YYYY-MM-DD'),
        moment(formDataForSubmit.timeList[1]).format('YYYY-MM-DD'),
      ],
      userList: userListTemp,
      projectYearList: yearFundData,
    });
  };

  //更新项目提交
  const updateSubmit = () => {
    var userListTemp: any = [];
    selectedUserListTabelData.map((e: any) => {
      var temp = {
        userid: e.username,
        username: e.realName,
        userrank: e.userrank,
        usertype: e.usertype,
        userindentify: e.userindentify,
        userjobtitle: e.technicalName,
        userjoblevel: e.technicalGrade,
      };
      userListTemp.push(temp);
    });
    updateVertProj.run({
      ...formDataForSubmit,
      timeList: [
        moment(formDataForSubmit.timeList[0]).format('YYYY-MM-DD'),
        moment(formDataForSubmit.timeList[1]).format('YYYY-MM-DD'),
      ],
      userList: userListTemp,
      projectYearList: yearFundData,
    });
  };

  //暂存项目提交
  const tempSubmit = () => {
    var temp = formRef.current?.getFieldsValue(true);
    temp = { ...temp, projectYearList: yearFundData };
    console.log(temp.timeList);
    if (temp.timeList && temp.timeList[0] && temp.timeList[1]) {
      temp.timeList = [
        moment(temp.timeList[0]).format('YYYY-MM-DD'),
        moment(temp.timeList[1]).format('YYYY-MM-DD'),
      ];
    }
    if (selectedUserListTabelData?.length) {
      var userListTemp: any = [];
      selectedUserListTabelData.map((e: any) => {
        var temp = {
          userid: e.username,
          username: e.realName,
          userrank: e.userrank,
          usertype: e.usertype,
          userindentify: e.userindentify,
          userjobtitle: e.technicalName,
          userjoblevel: e.technicalGrade,
        };
        userListTemp.push(temp);
      });
      temp.userList = userListTemp;
    }

    console.log(temp);
    insertTempVertProj.run(temp);
  };

  //根据时间区间生成年度小表
  const createYearFoundTable = () => {
    const timeString2Int = (timeString: any) => {
      return parseInt(moment(timeString).format('YYYY'));
    };
    var tableDataTemp = JSON.parse(JSON.stringify(yearFundData));
    var startTime = timeString2Int(
      formRef.current?.getFieldValue('timeList')[0],
    );
    var endTime = timeString2Int(formRef.current?.getFieldValue('timeList')[1]);
    var temp: any;
    var tempList: any = [];
    for (var i = endTime; i >= startTime; i--) {
      temp = {
        year: i + '',
        yearFund: 0,
        tableKey: i + '0' + Math.trunc(Math.random() * 100),
      };
      tableDataTemp.map((e: any) => {
        if (e.year === i + '') {
          temp = e;
        }
      });
      tempList.push(temp);
    }
    setYearFoundData(tempList);
  };

  useEffect(() => {
    if (pageType != 'new') {
      getOneVertProjDetail.run(pageType);
    }
  }, []);

  return (
    <PageContainer
      header={{
        title: getOneVertProjDetail?.data?.message ? (
          <div style={{ fontSize: 14, textAlign: 'center', color: 'red' }}>
            拒绝原因：{getOneVertProjDetail?.data?.message}
          </div>
        ) : null,
        breadcrumb: (
          <Breadcrumb>
            <Breadcrumb.Item>科学研究</Breadcrumb.Item>
            <Breadcrumb.Item>纵向项目</Breadcrumb.Item>
            <Breadcrumb.Item>
              {TitleAdapter(
                pageType,
                localStorage.getItem('isEdit'),
                '纵向项目',
              )}
            </Breadcrumb.Item>
          </Breadcrumb>
        ),
      }}
      extra={
        <div>
          {localStorage.getItem('isEdit') === '审核' ? (
            <Space>
              <ModalForm
                title="拒绝"
                trigger={<Button key="2">返回成员修改</Button>}
                autoFocusFirstInput
                modalProps={{
                  onCancel: () => console.log('run'),
                  destroyOnClose: true,
                }}
                submitTimeout={2000}
                onFinish={async (values) => {
                  console.log(values);
                  updateStatusIpi
                    .run({
                      tableName: 'VERTICAL_PROJECT',
                      ids: [pageType],
                      status: 3, //拒绝
                      message: values.message,
                      tab: '子方向视角',
                    })
                    .then(() => {
                      getOneVertProjDetail.run(pageType).then((e) => {
                        formRef.current?.setFieldsValue(e);
                        setNewPath(e?.annexPath);
                      });
                      history.goBack();
                      message.success('操作成功');
                    });
                  return true;
                }}
                grid={true}
                initialValues={{ message: getOneVertProjDetail?.data?.message }}
              >
                <ProForm.Group>
                  <ProFormText
                    name="message"
                    label="拒绝原因"
                    placeholder="请输入拒绝原因"
                    colProps={{ span: 24 }}
                    rules={[{ required: true, message: '请输入拒绝原因' }]}
                  />
                </ProForm.Group>
              </ModalForm>
              <Button
                key="1"
                type="primary"
                onClick={() => {
                  updateStatusIpi
                    .run({
                      tableName: 'VERTICAL_PROJECT',
                      ids: [pageType],
                      status: 2, //审核通过
                      tab: '子方向视角',
                    })
                    .then(() => {
                      getOneVertProjDetail.run(pageType).then((e) => {
                        formRef.current?.setFieldsValue(e);
                        setNewPath(e?.annexPath);
                      });
                      history.goBack();
                      message.success('操作成功');
                    });
                }}
              >
                提交管理员审核
              </Button>
            </Space>
          ) : null}
        </div>
      }
      content={
        localStorage.getItem('isEdit') === '查看' ? (
          formData ? (
            <ProDescriptions
              column={4}
              request={async () => {
                return Promise.resolve({
                  success: true,
                  data: formData,
                });
              }}
              bordered
              labelStyle={{ width: 170 }}
            >
              <Item
                label={'序号'}
                dataIndex={'seq'}
                hideInDescriptions={
                  localStorage.getItem('identity') !== '管理员'
                }
                span={4}
              />
              <Item label={'项目编号'} dataIndex={'projectId'} span={2} />
              <Item label={'项目名称'} dataIndex={'projectName'} span={2} />
              <Item label={'负责人'} dataIndex={'director'} span={2} />
              <Item
                label={'项目来源'}
                dataIndex={'projectSource'}
                tooltip={'委托单位名称'}
                span={2}
              />
              <Item
                label={'实验室人员'}
                dataIndex={'labUser'}
                span={2}
                hideInDescriptions={
                  localStorage.getItem('identity') !== '管理员'
                }
              />
              <Item
                label={'学生及非本室人员'}
                dataIndex={'stuAndOutUser'}
                span={2}
                hideInDescriptions={
                  localStorage.getItem('identity') !== '管理员'
                }
              />
              <Item label={'负责单位'} dataIndex={'projectCompany'} span={2} />
              <Item label={'单位排名'} dataIndex={'companyRank'} span={2} />
              <Item label={'项目级别'} dataIndex={'projectLevel'} span={2} />
              <Item label={'项目类别'} dataIndex={'projectType'} span={2} />
              {/* <Item
                label={'项目子类别'}
                dataIndex={'projectChildType'}
                span={2}
              /> */}
              <Item label={'项目总经费(万元)'} span={2}>
                {
                  <>
                    {formData.totalFund}
                    <Button
                      type="link"
                      onClick={() => {
                        setYearVisible(true);
                        setYearFoundData(yearFundDataTemp);
                      }}
                    >
                      查看详情
                    </Button>
                  </>
                }
              </Item>
              <Item
                label={'项目开始时间'}
                dataIndex={'startTime'}
                valueType={'dateMonth'}
                span={2}
              />
              <Item
                label={'项目结束时间'}
                dataIndex={'endTime'}
                valueType={'dateMonth'}
                span={2}
              />
              <Item
                label={'项目状态'}
                dataIndex={'projectState'}
                hideInDescriptions={
                  localStorage.getItem('identity') !== '管理员'
                }
                span={2}
              />
              <Item label={'佐证材料'} span={2}>
                {formData.annexPath ? (
                  <Button
                    type="link"
                    onClick={() => {
                      window.open(formData.annexPath);
                    }}
                  >
                    {' '}
                    查看材料
                  </Button>
                ) : (
                  '暂无材料'
                )}
              </Item>

              <Item
                label={'项目标签'}
                dataIndex={'labelList'}
                span={2}
                hideInDescriptions={
                  localStorage.getItem('identity') !== '管理员'
                }
                request={async () => {
                  return allLabel;
                }}
              />
            </ProDescriptions>
          ) : (
            ''
          )
        ) : (
          <ProForm
            grid
            // layout="horizontal"
            onFinish={async (values) => {
              console.log(values);
              if (!values?.annexPath) {
                message.warning('请上传材料！');
              } else {
                if (pageType == 'new') {
                  setSaveType('新增');
                } else {
                  setSaveType('更新');
                }
                setFormDataForSubmit(values);
                getUserList.run({ userList: values.director });
              }
            }}
            formRef={formRef}
            autoFocusFirstInput
            submitter={{
              render: (props, dom) => (
                <FooterToolbar>
                  {localStorage.getItem('isEdit') === '审核' ? null : (
                    <>
                      {pageType === 'new' ||
                      getOneVertProjDetail?.data?.isPass + '' === '-1' ? (
                        <Button
                          onClick={() => {
                            setSaveType('暂存');
                            let values = props.form?.getFieldsValue();
                            if (values.director) {
                              getUserList
                                .run({ userList: values.director })
                                .catch((e) => message.error('作者填写有误'));
                            } else {
                              tempSubmit();
                            }
                          }}
                        >
                          暂存
                        </Button>
                      ) : null}
                      <Button type="primary" htmlType="submit">
                        提交
                      </Button>
                    </>
                  )}
                </FooterToolbar>
              ),
            }}
          >
            <ProFormDigit name={'id'} label={'编号'} hidden />
            <ProFormText
              name={'annexState'}
              label={'佐证材料状态'}
              colProps={{ span: 8 }}
              hidden
            />
            <ProFormText name={'annexPath'} label={'佐证材料地址'} hidden />
            <ProFormText
              name={'isPass'}
              label={'审核状态'}
              colProps={{ span: 8 }}
              disabled
              hidden
            />
            <ProFormDigit
              name={'companyRank'}
              label={'单位排名'}
              colProps={{ span: 6 }}
              hidden
            />
            <ProForm.Group rowProps={{ gutter: gutter }} title={'基本信息'}>
              <ProFormDigit
                name={'seq'}
                label={'序号'}
                colProps={{ span: 4 }}
                hidden={true}
                disabled
              />
              <ProFormText
                name={'projectName'}
                label={'项目名称'}
                colProps={{
                  span: 5,
                }}
                rules={[{ required: true, message: '请输入项目名称' }]}
              />
              <ProFormText
                name={'director'}
                label={'负责人'}
                colProps={{ span: 5 }}
                rules={[{ required: true, message: '请输入负责人' }]}
              />
            </ProForm.Group>
            <ProForm.Group rowProps={{ gutter: gutter }} title={'详细内容'}>
              {/* <ProFormDatePicker.Year
                name={'year'}
                label={'年度'}
                placeholder={'请选择'}
                colProps={{ span: 8 }}
                hidden={localStorage.getItem('identity') !== '管理员'}
              /> */}
              <ProFormSelect
                name={'projectLevel'}
                label={'项目级别'}
                colProps={{ span: 5 }}
                options={[
                  {
                    label: '国家级',
                    value: '国家级',
                  },
                  {
                    label: '省部级',
                    value: '省部级',
                  },
                ]}
                rules={[{ required: true, message: '请选择项目级别' }]}
                fieldProps={{
                  onChange() {
                    formRef.current?.setFieldsValue({
                      projectType: '',
                      projectChildType: '',
                    });
                  },
                }}
              />
              <ProFormDependency name={['projectLevel']}>
                {({ projectLevel }) => {
                  if (projectLevel === '国家级') {
                    return (
                      <>
                        <ProFormSelect.SearchSelect
                          mode="single"
                          name={'projectType'}
                          label={'项目类别'}
                          colProps={{
                            span: 5,
                          }}
                          fieldProps={{ labelInValue: false }}
                          rules={[
                            { required: true, message: '请选择项目类别' },
                          ]}
                          options={[
                            {
                              label: '国家科技重大专项',
                              value: '国家科技重大专项',
                            },
                            {
                              label: '国家重点研发计划',
                              value: '国家重点研发计划',
                            },
                            {
                              label: '科技创新2030重大项目',
                              value: '科技创新2030重大项目',
                            },
                            {
                              label: '国家自然科学基金',
                              value: '国家自然科学基金',
                            },
                            {
                              label: '国家级其他项目',
                              value: '国家级其他项目',
                            },
                          ]}
                        />
                        {/* <ProFormDependency name={['projectType']}>
                            {({ projectType }) => {
                              if (projectType === '国家自然科学基金') {
                                return (
                                  <ProFormSelect.SearchSelect
                                    mode="single"
                                    name={'projectChildType'}
                                    label={'项目子类别'}
                                    colProps={{ span: 8 }}
                                    fieldProps={{ labelInValue: false }}
                                    rules={[
                                      {
                                        required: true,
                                        message: '请选择',
                                      },
                                    ]}
                                    options={[
                                      {
                                        label: '面上项目',
                                        value: '面上项目',
                                      },
                                      {
                                        label: '重点项目',
                                        value: '重点项目',
                                      },
                                      {
                                        label: '重大项目',
                                        value: '重大项目',
                                      },
                                      {
                                        label: '重大研究计划项目',
                                        value: '重大研究计划项目',
                                      },
                                      {
                                        label: '青年科学基金项目',
                                        value: '青年科学基金项目',
                                      },
                                      {
                                        label: '地区科学基金项目',
                                        value: '地区科学基金项目',
                                      },
                                      {
                                        label: '优秀青年科学基金项目',
                                        value: '优秀青年科学基金项目',
                                      },
                                      {
                                        label: '国家杰出青年科学基金项目',
                                        value: '国家杰出青年科学基金项目',
                                      },
                                      {
                                        label: '创新研究群体项目',
                                        value: '创新研究群体项目',
                                      },
                                      {
                                        label: '基础科学中心项目',
                                        value: '基础科学中心项目',
                                      },
                                      {
                                        label:
                                          '海外及港澳学者合作研究基金项目',
                                        value:
                                          '海外及港澳学者合作研究基金项目',
                                      },
                                      {
                                        label:
                                          '国际（地区）合作研究与交流项目',
                                        value:
                                          '国际（地区）合作研究与交流项目',
                                      },
                                      {
                                        label: '联合基金项目',
                                        value: '联合基金项目',
                                      },
                                      {
                                        label: '数学天元基金项目',
                                        value: '数学天元基金项目',
                                      },
                                      {
                                        label: '国家重大科研仪器研制项目',
                                        value: '国家重大科研仪器研制项目',
                                      },
                                    ]}
                                  />
                                );
                              } else {
                                return (
                                  <ProFormText
                                    name={'projectChildType'}
                                    label={'项目子类别'}
                                    colProps={{ span: 8 }}
                                    rules={
                                      projectType === '国家级其他项目'
                                        ? [
                                          {
                                            required: true,
                                            message: '输入',
                                          },
                                        ]
                                        : []
                                    }
                                  />
                                );
                              }
                            }}
                          </ProFormDependency> */}
                      </>
                    );
                  } else {
                    return (
                      <ProFormSelect.SearchSelect
                        mode="single"
                        name={'projectType'}
                        label={'项目类别'}
                        colProps={{
                          span: 5,
                        }}
                        fieldProps={{ labelInValue: false }}
                        rules={[{ required: true, message: '请选择项目类别' }]}
                        options={[
                          {
                            label: '创新研究群体项目',
                            value: '创新研究群体项目',
                          },
                          {
                            label: '河北省全职引进高端人才',
                            value: '河北省全职引进高端人才',
                          },
                          {
                            label: '央引导地方科技发展专项',
                            value: '央引导地方科技发展专项',
                          },
                          {
                            label: '天津市新一代人工智能重大专项',
                            value: '天津市新一代人工智能重大专项',
                          },
                          {
                            label: '天津市人才发展特支计划',
                            value: '天津市人才发展特支计划',
                          },
                          {
                            label: '科技研发平台建设专项',
                            value: '科技研发平台建设专项',
                          },
                          {
                            label: '杰出青年科学基金',
                            value: '杰出青年科学基金',
                          },
                          {
                            label: '河北省引进海外高层次人才“百人计划”资助',
                            value: '河北省引进海外高层次人才“百人计划”资助',
                          },
                          {
                            label: '河北省重点研发计划',
                            value: '河北省重点研发计划',
                          },
                          { label: '重点项目', value: '重点项目' },
                          {
                            label: '杰出青年基金',
                            value: '杰出青年基金',
                          },
                          {
                            label: '优秀青年基金',
                            value: '优秀青年基金',
                          },
                          {
                            label: '天津市科委人才项目',
                            value: '天津市科委人才项目',
                          },
                          {
                            label: '应用基础研究计划重点项目',
                            value: '应用基础研究计划重点项目',
                          },
                          {
                            label: '绿色通道项目',
                            value: '绿色通道项目',
                          },
                          {
                            label: '软科学研究专项',
                            value: '软科学研究专项',
                          },
                          {
                            label: '河北省自然科学基金青年基金',
                            value: '河北省自然科学基金青年基金',
                          },
                          {
                            label: '青年科学基金',
                            value: '青年科学基金',
                          },
                          { label: '面上项目', value: '面上项目' },
                          {
                            label: '天津市科技厅中央引导地方',
                            value: '天津市科技厅中央引导地方',
                          },
                          {
                            label: '河北省“巨人计划”',
                            value: '河北省“巨人计划”',
                          },
                          {
                            label: '河北省科技厅中央引导地方',
                            value: '河北省科技厅中央引导地方',
                          },
                          {
                            label: '天津市自然科学基金重点项目',
                            value: '天津市自然科学基金重点项目',
                          },
                          {
                            label: '河北省自然科学基金优秀青年基金',
                            value: '河北省自然科学基金优秀青年基金',
                          },
                          {
                            label: '河北省科技厅应用基础研究计划重点项目',
                            value: '河北省科技厅应用基础研究计划重点项目',
                          },
                          {
                            label: '天津市自然科学基金面上项目',
                            value: '天津市自然科学基金面上项目',
                          },
                          {
                            label: '河北省自然科学基金面上项目',
                            value: '河北省自然科学基金面上项目',
                          },
                          {
                            label: '中科院纳米器件与应用重点实验室开放课题',
                            value: '中科院纳米器件与应用重点实验室开放课题',
                          },
                          {
                            label: '发光学及应用国家重点实验室开放基金',
                            value: '发光学及应用国家重点实验室开放基金',
                          },
                          {
                            label: '河北省全职引进高端人才科研项目',
                            value: '河北省全职引进高端人才科研项目',
                          },
                          { label: '一般项目', value: '一般项目' },
                          {
                            label: '中国博士后科学基金特别资助',
                            value: '中国博士后科学基金特别资助',
                          },
                          { label: '人才类', value: '人才类' },
                          {
                            label: '国防科工委快响项目',
                            value: '国防科工委快响项目',
                          },
                          { label: '国防科工局', value: '国防科工局' },
                          { label: '开放课题', value: '开放课题' },
                          {
                            label: '河北省海外高层次人才“百人计划”资助',
                            value: '河北省海外高层次人才“百人计划”资助',
                          },
                          {
                            label: '河北省科技厅',
                            value: '河北省科技厅',
                          },
                          {
                            label: '河北省重点研发计划项目',
                            value: '河北省重点研发计划项目',
                          },
                          { label: '青年基金', value: '青年基金' },
                          { label: '省部级项目', value: '省部级项目' },
                          {
                            label: '河北省自然科学基金重点项目',
                            value: '河北省自然科学基金重点项目',
                          },
                          {
                            label: '第三批天津市人才发展特殊支持计划',
                            value: '第三批天津市人才发展特殊支持计划',
                          },
                          {
                            label: '天津市特支青年拔尖人才计划',
                            value: '天津市特支青年拔尖人才计划',
                          },
                          {
                            label: '河北省自然科学基金',
                            value: '河北省自然科学基金',
                          },
                          {
                            label: '河北省引智项目',
                            value: '河北省引智项目',
                          },
                          {
                            label: '天津市自然科学基金',
                            value: '天津市自然科学基金',
                          },
                          { label: '省科技厅', value: '省科技厅' },
                        ]}
                      />
                    );
                  }
                }}
              </ProFormDependency>

              <ProFormText
                name={'projectState'}
                label={'项目状态'}
                colProps={{ span: 5 }}
                placeholder={''}
                disabled
                hidden={true}
              />
            </ProForm.Group>
            <ProForm.Group rowProps={{ gutter: gutter }}>
              <ProFormText
                name={'projectId'}
                label={'项目编号(若无编号，可填批准文件的文件号)'}
                colProps={{ span: 5 }}
                rules={[{ required: true, message: '请输入项目编号' }]}
              />
              <ProFormText
                name={'projectSource'}
                label={'项目来源(委托单位名称)'}
                colProps={{ span: 5 }}
                rules={[{ required: true, message: '请输入项目来源' }]}
              />
              <ProFormText
                name={'projectCompany'}
                label={'项目负责单位'}
                colProps={{ span: 5 }}
                rules={[{ required: true, message: '请输入项目负责单位' }]}
              />
            </ProForm.Group>
            <ProForm.Group>
              <ProFormText
                name={'labUser'}
                label={'实验室人员'}
                colProps={{ span: 5 }}
                rules={[{ required: true, message: '请输入实验室人员' }]}
                hidden={localStorage.getItem('identity') !== '管理员'}
              />
              <ProFormText
                name={'stuAndOutUser'}
                label={'学生及非本室人员'}
                colProps={{ span: 5 }}
                hidden={localStorage.getItem('identity') !== '管理员'}
              />
              <ProFormText
                name={'allPerson'}
                label={'所有完成人(学生姓名后标注*，外单位人员名字后标注#)'}
                colProps={{ span: 10 }}
                hidden={localStorage.getItem('identity') == '管理员'}
                placeholder={'请输入，以英文逗号分割'}
                rules={
                  localStorage.getItem('identity') == '管理员'
                    ? []
                    : [{ required: true, message: '请输入所有完成人' }]
                }
              />
            </ProForm.Group>
            <ProForm.Group title={'经费及时限'}>
              <ProFormDigit
                name={'totalFund'}
                label={'项目总经费(万元)'}
                colProps={{ span: 5 }}
                rules={[{ required: true, message: '请输入项目总经费' }]}
              />
              <ProFormDateRangePicker
                name={'timeList'}
                label={'项目起止时间'}
                fieldProps={{
                  picker: 'month',
                  format: 'YYYY-MM',
                  onOpenChange: (open) => {
                    if (!open && formRef?.current?.getFieldValue('timeList')) {
                      createYearFoundTable();
                    }
                  },
                }}
                colProps={{ span: 5 }}
                rules={[{ required: true, message: '请选择项目起止时间' }]}
              />
            </ProForm.Group>
            <ProForm.Group colProps={{ span: 12 }}>
              <ProCard
                title={'年度到校金额'}
                bordered
                // extra={
                //   <ModalForm
                //     trigger={<Button type={'link'}> 新增到校款</Button>}
                //     onFinish={async (values) => {
                //       var temp = JSON.parse(JSON.stringify(yearFundData));
                //       temp.push({
                //         ...values,
                //         tableKey:
                //           values.year +
                //           '' +
                //           (values.yearFund + '') +
                //           Math.trunc(Math.random() * 100),
                //       });
                //       setYearFoundData(temp);
                //       return true;
                //     }}
                //     width={'20%'}
                //     grid
                //     modalProps={{
                //       destroyOnClose: true,
                //     }}
                //     title={'新增到校款'}
                //   >
                //     <ProFormDatePicker.Year
                //       name={'year'}
                //       label={'年度'}
                //       rules={[{ required: true, message: '请输入年度' }]}
                //     />
                //     <ProFormDigit
                //       name={'yearFund'}
                //       label={'到校款金额(万元)'}
                //       rules={[{ required: true, message: '请输入到校款金额' }]}
                //     />
                //   </ModalForm>
                // }
              >
                <ProTable
                  columns={columnsYearFoundForm}
                  dataSource={yearFundData}
                  search={false}
                  size={'small'}
                  rowKey={'tableKey'}
                  toolBarRender={false}
                  pagination={false}
                ></ProTable>
              </ProCard>
            </ProForm.Group>
            <ProForm.Group title={'佐证材料'}>
              <ProFormSelect
                name={'labelList'}
                label={'项目标签'}
                mode={'multiple'}
                hidden={localStorage.getItem('identity') !== '管理员'}
                colProps={{ span: 24 }}
                options={getAllLabel.data}
                placeholder={'请选择'}
                addonAfter={
                  <ModalForm<{
                    year: string;
                    labelName: string;
                  }>
                    title="新增标签"
                    trigger={<a>新增标签</a>}
                    autoFocusFirstInput
                    modalProps={{
                      onCancel: () => console.log('run'),
                    }}
                    submitTimeout={2000}
                    onFinish={async (values) => {
                      addLabelDetail.run(values);
                      return true;
                    }}
                  >
                    <ProForm.Group>
                      <ProFormDatePicker.Year
                        width="md"
                        name="year"
                        label="标签年份"
                        required
                      />
                      <ProFormText
                        width="md"
                        name="labelName"
                        label="标签名称"
                        required
                      />
                    </ProForm.Group>
                  </ModalForm>
                }
              />
              <ProForm.Group>
                <ModalForm
                  title="上传材料"
                  trigger={
                    <Button icon={<UploadOutlined />} type="link">
                      上传材料(上传盖章的项目任务书或计划书，以项目名称命名)
                    </Button>
                  }
                  autoFocusFirstInput
                  submitTimeout={2000}
                  onFinish={async (values) => true}
                >
                  {/* TbaleExplainMap['STANDARD'] 要修改 */}
                  <ProCard
                    title={'上传盖章的项目任务书或计划书，以项目名称命名'}
                  >
                    {/* 有小问题，需要修改成pro的dragger */}
                    <Dragger {...props} maxCount={1}>
                      <p className="ant-upload-drag-icon">
                        <InboxOutlined />
                      </p>
                      <p className="ant-upload-text">
                        单击或拖动文件到此区域进行上传
                      </p>
                      <p className="ant-upload-hint">请上传一个文件</p>
                    </Dragger>
                  </ProCard>
                </ModalForm>
                <Button
                  type="link"
                  onClick={() => {
                    formRef.current?.getFieldValue('annexPath')
                      ? window.open(formRef.current?.getFieldValue('annexPath'))
                      : message.info('请上传材料');
                  }}
                  icon={<FileSearchOutlined />}
                >
                  查看材料
                </Button>
              </ProForm.Group>
            </ProForm.Group>
          </ProForm>
        )
      }
    >
      <Modal
        visible={userListTabelFlag}
        onOk={() => {
          console.log(selectedUserListTabelData);
          switch (saveType) {
            case '新增':
              insertSubmit();
              break;
            case '更新':
              updateSubmit();
              break;
            case '暂存':
              tempSubmit();
              break;
          }
          setUserListTabelFlag(false);
        }}
        onCancel={() => setUserListTabelFlag(false)}
        title={'请确认人员！'}
      >
        <ProTable
          rowKey={'webId'}
          columns={columns}
          search={false}
          dataSource={userListTabelData}
          toolBarRender={false}
          rowSelection={{
            onChange: (selectedRowKeys, selectedRows) => {
              setSelectedUserListTabelData(selectedRows);
              setSelectedRowKeys(selectedRowKeys);
            },
            selectedRowKeys: selectedRowKeys,
          }}
          tableAlertRender={false}
          pagination={false}
        />
      </Modal>

      <Modal
        visible={yearVisible}
        footer={
          <Space>
            <Button
              type={'primary'}
              onClick={() => {
                setYearVisible(false);
              }}
            >
              取消
            </Button>
            <Button
              type={'primary'}
              onClick={() => {
                updateYearFund.run({
                  tableName: 'VERTICAL_PROJECT',
                  itemId: parseInt(pageType),
                  pyList: yearFundData,
                });
              }}
            >
              提交
            </Button>
          </Space>
        }
        onCancel={() => setYearVisible(false)}
        title={
          <Space>
            <>{'年度到款金额'}</>
            {/* <>{'  '}</>
            <ModalForm
              title={'添加年度'}
              trigger={<Button type={'primary'}> 添加年度</Button>}
              onFinish={async (values) => {
                var temp = JSON.parse(JSON.stringify(yearFundData));
                temp.push({
                  ...values,
                  tableKey:
                    values.year +
                    '' +
                    (values.yearFund + '') +
                    Math.trunc(Math.random() * 100),
                });
                setYearFoundData(temp);
                return true;
              }}
              width={'20%'}
              grid
              modalProps={{
                destroyOnClose: true,
              }}
            >
              <ProFormDatePicker.Year
                name={'year'}
                label={'年度'}
                rules={[{ required: true, message: '请输入年度' }]}
              />
              <ProFormDigit
                name={'yearFund'}
                label={'到款金额(万元)'}
                rules={[{ required: true, message: '请输入到款金额' }]}
              />
            </ModalForm> */}
          </Space>
        }
        width={'30%'}
      >
        <ProTable
          columns={columnsYearFoundList}
          dataSource={yearFundData}
          search={false}
          size={'small'}
          rowKey={'tableKey'}
          toolBarRender={false}
          pagination={false}
        />
      </Modal>
    </PageContainer>
  );
};
